<template>
  <Swiper v-if="banners.length>0" >
    <Slide v-for="(item,index) in banners" :key="index">
      <a :href="item.link">
        <img :src="item.image" alt="" style="width:100%"  @load="imageLoad">
      </a>
    </Slide>
  </Swiper>
</template>

<script>
  import {Swiper,Slide} from 'vue-swiper-component'

  export default {
    name: "HomeSwiperGithub",
    props: {
      banners: {
        type: Array,
        default(){      //因为是子组件,所以必须return数据
          return [];
        }
      }
    },
    components: {
      Swiper,
      Slide
    },
    data(){
      return {
        isLoad:false
      }
    },
    methods:{
      imageLoad(){
        if(!this.isLoad){
          this.$emit('swiperImageLoad')
          this.isLoad=true;
        }
      }
    }
  }
</script>

<style scoped>

</style>
